<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="../build/browser.min.js"></script>
    <script src="https://cdn.bootcss.com/redux/3.7.2/redux.js"></script>
  </head>
  <body>
    <div id="example"></div>
    <script >
        /*
            1.设计思想
                （1）Web 应用是一个状态机，视图与状态是一一对应的。
                （2）所有的状态，保存在一个对象里面。
        
            2.基本概念和思想
                Store
                    保存数据的地方，你可以把它看成一个容器。整个应用只能有一个 Store
                    Redux 提供createStore这个函数，用来生成 Store。
                State
                    Store对象包含所有数据
                    当前时刻的 State，可以通过store.getState()拿到。
                    Redux 规定， 一个 State 对应一个 View, State与View相互对应
                Action
                    首先 View(用户接触到的view促使State变化) 
                    然后 Action(View 发出的通知 通知state应该要发生变化了)
                    接着 State (做出相应变化)

                    Action 是一个对象。其中的type属性是必须的，表示 Action 的名称。其他属性可以自由设置
                小总结：Action 描述当前发生的事情。改变 State 的唯一办法是使用 Action。它会运送数据到 Store。
                Action Creator
                    View 要发送多少种消息，就会有多少种 Action
                    定义一个函数来生成 Action
                store.dispatch()
                    store.dispatch()是 View 发出 Action 的唯一方法。
                    store.dispatch方法会触发 Reducer 的自动执行：
                        在生成 Store 的时候，将 Reducer 传入createStore方法
                            import { createStore } from 'redux';
                            const store = createStore(reducer);
                        即createStore接受 Reducer 作为参数，生成一个新的 Store，
                        以后每当store.dispatch发送过来一个新的 Action，就会自动调用 Reducer，得到新的 State
                Reducer
                    Store 收到 Action 以后，必须给出一个新的 State，这样 View 才会发生变化。
                    这种 State 的计算过程就叫做 Reducer。
                    Reducer 是一个函数，它接受 Action 和当前 State 作为参数，返回一个新的 State。
                纯函数
                store.subscribe()
                    Store 允许使用store.subscribe方法设置监听函数，一旦 State 发生变化，就自动执行这个函数。
        
        
        */

        /*
            store： Store是我们储存状态数据state的地方
            创建store :通过redux当中的createStore方法
                import { createStore } from 'redux'
                import counter from './reducers'
                const store = createStore(counter)
            @param:counter =>之前定义好的reducer函数
            store即为存储reducer方法处理的并内置状态数据的仓库
            此时通过createStore生成的store有三个方法：
                getState: 获取当前存储中的状态数据。
                dispatch:
                    1.将传入的action操作执行(根据传入的action具体调用reducer来获取新的状态数据)
                    2.触发listeners事件监听器(触发所有的listener，响应状态数据改变之后的动作)

                subscribe:添加listener的方法,同时它会返回一个unsubscribe的方法用来取消listener
        
         */
        
       
    </script>
  </body>
</html>
